<template>
	<div class="model">
		<h2 class="model__title">
			选择区域
			<span @click="close" class="model__title--close">&times;</span>
		</h2>
		<div class="model__content">
			<el-form label-width="120px">
				<el-form-item label="选择区域">
					<s-get-area :is_open="0" @getArea="handleGetArea"></s-get-area>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="check_submit">
						<span>提交</span>
					</el-button>
				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
	import getArea from "../../../components/cascader/province_cascader.vue"
	export default {

		components: {
			"s-get-area": getArea
		},
		created(){
		},
		props: ["id"],
		data() {
			return {
				area_id: null
			}
		},
		methods: {
			close() {
				this.$parent.showAgreeModel = false;
			},
			loadData() {
			},
			check_submit() {
				if(!this.area_id) {
					this.$message({
						type: "error",
						message: '请选择区域'
					});
					return;
				}
				this.$parent.okAgreeManager(this.id, this.area_id);
			},
			handleGetArea(area_id) {
				this.area_id = area_id;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.model {
		width: 400px;
		left: calc(50% - 200px);
		height: 300px;
		top: 100px;
	}
</style>